<#include "/common/layout.html">
<@body>
<div class="content">
	<div class="nav-tabs-custom">
		<ul class="nav nav-tabs" id="select-tabs">
			<li class="active" data-formId ="addDirForm"><a href="#tab_1" data-toggle="tab">添加目录</a></li>
			<li data-formId ="addMenuForm"><a href="#tab_2" data-toggle="tab">添加菜单</a></li>
			<li data-formId ="addActionForm"><a href="#tab_3" data-toggle="tab">添加功能</a></li>
		</ul>
		<div class="tab-content">
			<div class="tab-pane active" id="tab_1">
				<div class="row">
					<div class="col-md-12">
						<form method="post" class="form-horizontal" action="/system/menu/doAddDir" id="addDirForm">
							<div class="box-body">
								<div class="form-group">
									<label for="code" class="col-sm-2 control-label">编码</label>
									<div class="col-sm-10">
										<input type="text" name="code" class="form-control" value="${deepCode}" readonly="readonly" required>
									</div>
								</div>
								<div class="form-group">
									<label for="menuName" class="col-sm-2 control-label">目录名称</label>
									<div class="col-sm-10">
										<input type="text" name="menuName" class="form-control" placeholder="请输入目录名称"  required>
									</div>
								</div>
								<div class="form-group">
									<label for="sort" class="col-sm-2 control-label">排序</label>
									<div class="col-sm-10">
										<input type="text" name="sort" class="form-control" value="${deepOrder}" readonly="readonly" required>
									</div>
								</div>
								<div class="form-group">
									<label for="icon" class="col-sm-2 control-label">图标</label>
									<div class="col-sm-10">
										<span class="form-control">当前图标为：<i id="dirIcon" class="fa fa-circle-o"></i>  
											<a href="javascript:void(0);" onclick="selectIcon(1)" class="pull-right">
												 点击选取图标
											</a>
										</span>
										<input type="hidden" class="form-control"  name="icon"  id="folderIcon" value="fa fa-circle-o">
									</div>
								</div>
							</div>
			 			</form>
					</div>
				</div>
			</div>
			<div class="tab-pane" id="tab_2">
				<div class="row">
					<div class="col-md-12">
						<form method="post" class="form form-horizontal" action="/system/menu/doAddMenu" id="addMenuForm">
							<div class="box-body">
								<div class="form-group">
									<label class="col-sm-2 control-label">父级目录</label>
									<div class="col-sm-10">
										<select id="menuPid" name="pid" class="form-control select2" style="width: 90%;" data-placeholder="--请选择父级目录--" required>
											<option></option>
											<#list list as m>
												<option value="${(m.menuId)!}">${(m.code)!}-${(m.menuName)!}</option>
											</#list>
										</select>
									</div>
								</div>
								<div class="form-group">
									<label for="code" class="col-sm-2 control-label">编码</label>
									<div class="col-sm-10">
										<input type="text" id="menuCode" readonly="readonly" name="code" class="form-control">
									</div>
								</div>
								<div class="form-group">
									<label for="menuName" class="col-sm-2 control-label">菜单名称</label>
									<div class="col-sm-10">
										<input type="text" name="menuName" class="form-control" placeholder="请输入菜单名称" required>
									</div>
								</div>
								<div class="form-group">
									<label for="url" class="col-sm-2 control-label">菜单URL</label>
									<div class="col-sm-10">
										<input type="text" name="url" class="form-control" placeholder="请输入菜单URL"  required>
									</div>
								</div>
								<div class="form-group">
									<label for="sort" class="col-sm-2 control-label">排序</label>
									<div class="col-sm-10">
										<input type="text" id="menuSort" readonly="readonly" name="sort" class="form-control">
									</div>
								</div>  
								<div class="form-group">
									<label for="icon" class="col-sm-2 control-label">图标 </label>
									<div class="col-sm-10">
										<span class="form-control">当前图标为：<i id="menuIcon" class="fa fa-circle-o"></i>  
											<a href="javascript:void(0);" onclick="selectIcon(2)" class="pull-right">
												 点击选取图标
											</a>
										</span>
										<input type="hidden" class="form-control"  name="icon" id="fileIcon" value="fa fa-circle-o">
									</div>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
			<div class="tab-pane" id="tab_3">
				<div class="row">
					<div class="col-md-12">
						<form method="post" class="form-horizontal" action="/system/menu/doAddAction" id="addActionForm">
							<div class="box-body">
								<div class="form-group">
									<label class="col-sm-2 control-label">父级目录</label>
									<div class="col-sm-10">
										<select id="dir" class="form-control select2" style="width:90%;" data-placeholder="--请选择父级目录--" required>
											<option></option>
											<#list list as m>
												<option value="${(m.menuId)!}">${(m.code)!}-${(m.menuName)!}</option>
											</#list>
										</select>
									</div>
								</div>
								<div class="form-group">
									<label class="col-sm-2 control-label">上级菜单</label>
									<div class="col-sm-10">
										<select id="actionPid" name="pid" class="form-control select2" style="width:90%;" data-placeholder="--请选择上级菜单--" required>
										<option></option>
										</select>
									</div>
								</div>
								<div class="form-group">
									<label for="code" class="col-sm-2 control-label">编码</label>
									<div class="col-sm-10">
										<input type="text" id="actionCode" name="code" class="form-control" readonly="readonly">
									</div>
								</div>
								<div class="form-group">
									<label for="menuName" class="col-sm-2 control-label">功能名称</label>
									<div class="col-sm-10">
										<input type="text" name="menuName" class="form-control" placeholder="请输入目录名称" required>
									</div>
								</div>
								<div class="form-group">
									<label for="resource" class="col-sm-2 control-label">权限资源</label>
									<div class="col-sm-10">
										<input type="text" id="resource" name="resource" class="form-control" placeholder="请输入权限资源名称"  required>
									</div>
								</div> 
								<div class="form-group">
									<label for="sort" class="col-sm-2 control-label">排序</label>
									<div class="col-sm-10">
										<input type="text" id="actionSort" name="sort" class="form-control" readonly="readonly">
									</div>
								</div>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
</@body>
<script type="text/javascript">
$("#dir").on('change',function(){
	var pid = $(this).val();
	$("#actionPid").prop("disabled",false);
	$.post('/system/menu/json?_dc='+new Date().getTime(),{pid:pid},function(response){
		if(response.code==200){
			$("#actionPid").empty();
			var initOption = {"id": -1,"text": "--请选择上级菜单--"};
			response.data.unshift(initOption)
			$("#actionPid").select2({
				data:response.data
			});
		}
	}); 
});
//菜单栏编码自动填充
$("#menuPid").on('change',function(){
	var pid = $(this).val();
	if(!pid){
		$("#menuCode").val('');
		$("#menuSort").val('');
	}else{
		var dataCode = $(this).select2('data')[0].text.split("-");
		$.post('/system/menu/menuCount?_dc='+new Date().getTime(),{pid:pid},function(response){
			if(response.code==200){
				if(response.data.toString().length == 1){
					$("#menuCode").val(dataCode[0] + '0' + response.data);
				} else if (response.data.toString().length >= 2) {
					$("#menuCode").val(dataCode[0] + response.data);
				}
				$("#menuSort").val(response.data);
			}
		});
	}
	
});
//功能栏编码自动填充
$("#actionPid").on("select2:open", function(e) {
	var pid = $("#dir").val();
	if(!pid){
		$.modal.msgWarning("请选选择父级目录");
	 	$("#actionPid").prop("disabled",true);
	}
});
$("#actionPid").on('change',function(){
	var pid = $(this).val();
	if(pid == -1){
		$("#actionCode").val('');
		$("#actionSort").val('');
	}else{
		var dataCode = $(this).select2('data')[0].text.split("-");
		$.post('/system/menu/menuCount?_dc='+new Date().getTime(),{pid:pid},function(response){
			if(response.code==200){
				if(response.data.toString().length == 1){
					$("#actionCode").val(dataCode[0] + '0' + response.data);
				} else if (response.data.toString().length >= 2) {
					$("#actionCode").val(dataCode[0] + response.data);
				}
				$("#actionSort").val(response.data);
			}
		});
	}
});

function submitHandler() {
	var fromId = $("#select-tabs").find(".active").attr("data-formId");
	var formObject = $("#"+fromId);
	if (formObject.validate().form()) {
		var formData = formObject.serialize();  
		var index = layer.load(3); // 换了种风格
		$.ajax({  
			url: formObject.attr('action'),  
			type: 'POST',
			dataType : "json",
			data: formData,
			beforeSend: function () {
				$.modal.loading("正在处理中，请稍后...");
				$.modal.disable();
			},
			success: function (data) {  
			layer.close(index);
 				if (data.code == 200) {
 					if(data.msg){
 						parent.layer.msg(data.msg, {icon : 1});
 					}else{
 						parent.layer.msg('提交成功', {icon : 1});
 					}
 					parent.layer.closeAll('iframe'); // 关闭当前frame
 					window.parent.dataTable.draw(false);
 				} else {
 					layer.msg(data.msg, {icon : 2 });
 					$.modal.closeLoading();
					$.modal.enable();
 				}
			}
		});
	}
}
function selectIcon(type){
	var layerIndex = parent.layer.getFrameIndex(window.name);
	parent.layer.open({
		type : 2,
		title : '选取图标',
		closeBtn : 1,
		anim: -1,
		isOutAnim: false,
		shadeClose : true,
		shade : 0.3,
		area : ['95%', '90%'],
		content : '/toicon',
		btn : [ '确定', '取消' ],
		yes : function(index, layero) {
			var iframeWin = layero.find('iframe')[0];
			iframeWin.contentWindow.submitHandler(index,layero);
		},
		success: function(layero, index){
			var body = parent.layer.getChildFrame('body', index);
			body.find("#sid").attr("iconType", type + "," + layerIndex);
		}
	});
}
</script>
